<template>
    <div>
        <!--        分割线-->
        <hr style="border: 1px dashed darkgray;transform: scaleY(0.5);">
        <div v-if="active===0">
            <el-tabs type="border-card" v-model="activeName" @tab-click="handlClick" style="position: absolute; width: 99%;">
                <el-tab-pane label="法院开庭信息" name="first">
                    <div v-if="active===0">
                        <el-row>
                            <el-col :span="3">
                                <el-input v-model="caseTrialSearch.searchData" clearable></el-input>
                            </el-col>
                            <el-col :span="3">
                                <el-select v-model="caseTrialSearch.select" filterable placeholder="请选择">
                                    <el-option label="案号搜索" value="1"></el-option>
                                    <el-option label="委托人搜索" value="2"></el-option>
                                    <el-option label="审判机关搜索" value="4"></el-option>
                                </el-select>
                            </el-col>
                            <el-col :span="3">
                                <el-select v-model="caseTrialSearch.status" clearable>
                                    <el-option label="未开庭" value="1"></el-option>
                                    <el-option label="已开庭" value="2"></el-option>
                                </el-select>
                            </el-col>
                            <el-col :span="3">
                                <el-select v-model="caseTrialSearch.sortMode">
                                    <el-option label="自定义排序" value="1"></el-option>
                                    <el-option label="编号倒序" value="2"></el-option>
                                </el-select>
                            </el-col>
                            <el-col :span="1" :offset=1>
                                <el-button type="primary" @click="seniorSearch">检索</el-button>
                            </el-col>
                            <el-col :span="1" :offset=2>
                                <el-button type="info" @click="addFy">添加</el-button>
                            </el-col>
                        </el-row>
                        <el-table
                                :data="trialData"
                                border
                                style="width: 100%;margin-top: 10px;margin-bottom: 10px">
                            <el-table-column
                                    align="center"
                                    prop="caseNo"
                                    label="案号"
                                    width="149">
                                <template slot-scope="scope">
                                    <a href="javascript:" @click="queryDetails(scope.row.id)">
                                        {{scope.row.caseNo}}
                                    </a>
                                </template>
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseWtr"
                                    label="委托人">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="flow"
                                    label="审判程序"
                                    width="254">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="lnsj"
                                    label="立案日期"
                                    width="254">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="ktsj"
                                    label="开庭日期"
                                    width="254">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="spjg"
                                    label="审判机关"
                                    width="254">
                            </el-table-column>
                        </el-table>
                        <el-pagination
                                @size-change="handleSizeChange"
                                @current-change="handleCurrentChange"
                                :current-page="1"
                                :page-sizes="[1, 5, 10, 20, 50, 100]"
                                :page-size="pageSize"
                                layout="total, sizes, prev, pager, next, jumper"
                                :total="total">
                        </el-pagination>
                    </div>
                </el-tab-pane>
                <el-tab-pane label="侦查机关" name="second">
                    <div v-if="active===0">
                        <el-row>
                            <el-col :span="3">
                                <el-input v-model="caseTrialSearch.searchData" clearable></el-input>
                            </el-col>
                            <el-col :span="3">
                                <el-select v-model="caseTrialSearch.select" filterable placeholder="请选择">
                                    <el-option label="案号搜索" value="1"></el-option>
                                    <el-option label="委托人搜索" value="2"></el-option>
                                    <el-option label="承办人搜索" value="3"></el-option>
                                </el-select>
                            </el-col>
                            <el-col :span="1" :offset=1>
                                <el-button type="primary" @click="seniorSearch">检索</el-button>
                            </el-col>
                            <el-col :span="1" :offset=2>
                                <el-button type="info" @click="addZc">添加</el-button>
                            </el-col>
                        </el-row>
                        <el-table
                                :data="trialData"
                                border
                                style="width: 100%;margin-top: 10px;margin-bottom: 10px">
                            <el-table-column
                                    align="center"
                                    prop="caseNo"
                                    label="案号"
                                    width="149">
                                <template slot-scope="scope">
                                    <a href="javascript:" @click="queryDetails(scope.row.id)">
                                        {{scope.row.caseNo}}
                                    </a>
                                </template>
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseWtr"
                                    label="委托人">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="bnjg"
                                    label="办案机关"
                                    width="212">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="cbr"
                                    label="承办人">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="tel"
                                    label="联系电话"
                                    width="212">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="dbsj"
                                    label="逮捕时间"
                                    width="212">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="xjsj"
                                    label="刑拘时间"
                                    width="212">
                            </el-table-column>
                        </el-table>
                        <el-pagination
                                @size-change="handleSizeChange"
                                @current-change="handleCurrentChange"
                                :current-page="1"
                                :page-sizes="[1, 5, 10, 20, 50, 100]"
                                :page-size="pageSize"
                                layout="total, sizes, prev, pager, next, jumper"
                                :total="total">
                        </el-pagination>
                    </div>
                </el-tab-pane>
                <el-tab-pane label="检查机关"  name="third">
                    <div v-if="active===0">
                        <el-row>
                            <el-col :span="3">
                                <el-input v-model="caseTrialSearch.searchData" clearable></el-input>
                            </el-col>
                            <el-col :span="3">
                                <el-select v-model="caseTrialSearch.select" filterable placeholder="请选择">
                                    <el-option label="案号搜索" value="1"></el-option>
                                    <el-option label="委托人搜索" value="2"></el-option>
                                    <el-option label="承办人搜索" value="3"></el-option>
                                </el-select>
                            </el-col>
                            <el-col :span="1" :offset=1>
                                <el-button type="primary" @click="seniorSearch">检索</el-button>
                            </el-col>
                            <el-col :span="1" :offset=2>
                                <el-button type="info" @click="addJc">添加</el-button>
                            </el-col>
                        </el-row>
                        <el-table
                                :data="trialData"
                                border
                                style="width: 100%;margin-top: 10px;margin-bottom: 10px">
                            <el-table-column
                                    align="center"
                                    prop="caseNo"
                                    label="案号"
                                    width="149">
                                <template slot-scope="scope">
                                    <a href="javascript:" @click="queryDetails(scope.row.id)">
                                        {{scope.row.caseNo}}
                                    </a>
                                </template>
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="caseWtr"
                                    label="委托人">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="bnjg"
                                    label="办案机关"
                                    width="212">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="cbr"
                                    label="承办人">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="tel"
                                    label="联系电话"
                                    width="212">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="qssjb"
                                    label="审查起诉时间"
                                    width="212">
                            </el-table-column>
                            <el-table-column
                                    align="center"
                                    prop="qssje"
                                    label="审查结束时间"
                                    width="212">
                            </el-table-column>
                        </el-table>
                        <el-pagination
                                @size-change="handleSizeChange"
                                @current-change="handleCurrentChange"
                                :current-page="1"
                                :page-sizes="[1, 5, 10, 20, 50, 100]"
                                :page-size="pageSize"
                                layout="total, sizes, prev, pager, next, jumper"
                                :total="total">
                        </el-pagination>
                    </div>
                </el-tab-pane>
            </el-tabs>
        </div>
        <div v-if="active===1">
            <span style="font-size: 25px;margin-left: 50px"><b>基本信息</b></span>
            <hr style="border: 1px dashed darkgray;width: 93%;transform: scaleY(0.5);margin-bottom: 25px">
            <el-form ref="fyForm" :model="fyForm" :rules="rules" label-width="80px" onsubmit="return false">
                <el-row>
                    <el-col :span="10" :offset=1>
                        <el-form-item label="案件" prop="caseNo">
                            <el-input v-model="fyForm.caseNo" placeholder="请选择案件" @click.native="choiceCase" readonly></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10" :offset=1>
                        <el-form-item label="委托人" prop="caseWtr">
                            <el-input v-model="fyForm.caseWtr" placeholder="选择案件后自动补全" readonly></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="10" :offset=1>
                        <el-form-item label="审判程序" prop="flow">
                            <el-input v-model="fyForm.flow" placeholder="选择案件后自动补全" readonly></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10" :offset=1>
                        <el-form-item label="审判机关" prop="spjg">
                            <el-input v-model="fyForm.spjg" placeholder="选择案件后自动补全" readonly></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="3"><span style="font-size: 25px;margin-left: 50px"><b>其他选填</b></span></el-col>
                    <el-col :span="1" style="padding-top: 5px">
                        <el-switch v-model="xt"></el-switch>
                    </el-col>
                </el-row>
                <hr style="border: 1px dashed darkgray;width: 1360px;transform: scaleY(0.5);margin-bottom: 25px">
                <div v-if="xt">
                    <el-row>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="上诉日期">
                                <el-date-picker type="date" placeholder="选择日期" v-model="fyForm.ssrq" style="width: 64%"></el-date-picker>
                                提前<el-input v-model="fyForm.sstx" id="sstx" placeholder="0"
                                            oninput="value=value.replace(/^\.+|[^\d.]/g,'')"
                                            @blur="salaryChange" style="width: 20%"></el-input>天提醒
                            </el-form-item>
                        </el-col>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="立案日期">
                                <el-date-picker type="date" placeholder="选择日期" v-model="fyForm.lnsj" style="width: 64%"></el-date-picker>
                                提前<el-input v-model="fyForm.lntx" id="lntx" placeholder="0"    oninput="value=value.replace(/^\.+|[^\d.]/g,'')"
                                            @blur="salaryChange" style="width: 20%"></el-input>天提醒
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="开庭日期">
                                <el-date-picker type="date" placeholder="选择日期" v-model="fyForm.ktsj" style="width: 64%"></el-date-picker>
                                提前<el-input v-model="fyForm.kttx"  id="kttx" placeholder="0"
                                            oninput="value=value.replace(/^\.+|[^\d.]/g,'')"
                                            @blur="salaryChange" style="width: 20%"></el-input>天提醒
                            </el-form-item>
                        </el-col>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="宣判日期">
                                <el-date-picker type="date" placeholder="选择日期" v-model="fyForm.xprq" style="width: 64%"></el-date-picker>
                                提前<el-input v-model="fyForm.xptx"  id="xptx"  placeholder="0"  oninput="value=value.replace(/^\.+|[^\d.]/g,'')"
                                            @blur="salaryChange" style="width: 20%"></el-input>天提醒
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="主审法官">
                                <el-input v-model="fyForm.fg"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="联系电话" prop="fgtel">
                                <el-input v-model="fyForm.fgtel"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="书记员">
                                <el-input v-model="fyForm.sjy"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="联系电话" prop="sjtel">
                                <el-input v-model="fyForm.sjtel"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="21" :offset=1>
                            <el-form-item label="备注" prop="">
                                <el-input type="textarea" v-model="fyForm.remark"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </div>
                <el-row>
                    <el-col :span="1" :offset=8>
                        <el-button type="info" @click="notcd('fyForm')">返回</el-button>
                    </el-col>
                    <el-col :span="1" :offset=2>
                        <el-button type="primary" @click="formSubmit('fyForm')" style="margin-left: -10px">立即创建</el-button>
                    </el-col>
                    <el-col :span="1" :offset=2>
                        <el-button @click="resetForm('fyForm')">重置</el-button>
                    </el-col>
                </el-row>
            </el-form>
        </div>
        <el-dialog
                title="请选择案件"
                :visible.sync="getCase"
                width="50%">
            <!--                    :before-close="handleClose"-->
            <span>
                    <el-table
                            @row-click="rowClick"
                            :data="caseData"
                            border
                            style="width: 100%">
                        <el-table-column
                                prop="caseNo"
                                label="案号">
                        </el-table-column>
                        <el-table-column
                                prop="caseWtr"
                                label="委托人">
                        </el-table-column>
                        <el-table-column
                                prop="caseOppositeParties"
                                label="对方当事人">
                        </el-table-column>
                        <el-table-column
                                prop="caseAgencyfee"
                                label="代理费">
                        </el-table-column>
                        <el-table-column
                                prop="caseAttorney"
                                label="承办律师">
                        </el-table-column>
                        <el-table-column
                                prop="collectionTime"
                                label="收案日期">
                        </el-table-column>
                    </el-table>
                </span>
            <span slot="footer" class="dialog-footer">
<!--                    <el-button @click="getLawyersList = false">取 消</el-button>-->
                    <el-button type="primary" @click="getCase = false">取 消</el-button>
                </span>
        </el-dialog>
        <div v-if="active===2">
            <el-button type="primary" @click="back">返回列表</el-button>
            <table border="1" cellpadding="0" cellspacing="0" class="case_table">
                <tr>
                    <td>
                        <span>案号</span>:<br>
                        {{trialData.caseNo}}
                    </td>
                    <td>
                        <span>委托人</span>:<br>
                        {{trialData.caseWtr}}
                    </td>
                    <td>
                        <span>登记人:</span><br>
                        {{trialData.uname}}
                    </td>
                    <td>
                        <span>审判程序:</span><br>
                        {{trialData.flow}}
                    </td>
                </tr>
                <tr>
                    <td>
                        <span>审判机关:</span><br>
                        {{trialData.spjg}}
                    </td>
                    <td>
                        <span>法庭:</span><br>
                        {{trialData.ft}}
                    </td>
                    <td>
                        <span>主审法官:</span><br>
                        {{trialData.fg}}
                    </td>
                    <td>
                        <span>法官电话:</span><br>
                        {{trialData.fgtel}}
                    </td>
                </tr>
                <tr>
                    <td>
                        <span>书记员:</span><br>
                        {{trialData.sjy}}
                    </td>
                    <td>
                        <span>书记电话:</span><br>
                        {{trialData.sjtel}}
                    </td>
                    <td>
                        <span>立案日期:</span><br>
                        {{trialData.lnrq}}
                    </td>
                    <td>
                        <span>开庭日期:</span><br>
                        {{trialData.ktrq}}
                    </td>
                </tr>
                <tr>
                    <td>
                        <span>宣判日期:</span><br>
                        {{trialData.xprq}}
                    </td>
                    <td>
                        <span>上诉日期:</span><br>
                        {{trialData.ssrq}}
                    </td>
                    <td>
                    </td>
                    <td>
                    </td>
                </tr>
                <tr>
                    <td colspan="4">
                        <span>备注:</span><br>
                        {{trialData.remark===''?'暂无备注':trialData.remark}}
                    </td>
                </tr>
            </table>
        </div>
        <div v-if="active===3">
            <span style="font-size: 25px;margin-left: 50px"><b>基本信息</b></span>
            <hr style="border: 1px dashed darkgray;width: 93%;transform: scaleY(0.5);margin-bottom: 25px">
            <el-form ref="zcForm" :model="zcForm" :rules="rules1" label-width="80px" onsubmit="return false">
                <el-row>
                    <el-col :span="10" :offset=1>
                        <el-form-item label="案件" prop="caseNo">
                            <el-input v-model="zcForm.caseNo" placeholder="请选择案件" @click.native="choiceCase" readonly></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10" :offset=1>
                        <el-form-item label="委托人" prop="caseWtr">
                            <el-input v-model="zcForm.caseWtr" placeholder="选择案件后自动补全" readonly></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="10" :offset=1>
                        <el-form-item label="承办人" prop="cbr">
                            <el-input v-model="zcForm.cbr" placeholder="请填写承办人"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10" :offset=1>
                        <el-form-item label="电话" prop="tel">
                            <el-input v-model="zcForm.tel" placeholder="请填写承办人电话"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="3"><span style="font-size: 25px;margin-left: 50px"><b>其他选填</b></span></el-col>
                    <el-col :span="1" style="padding-top: 5px">
                        <el-switch v-model="xt"></el-switch>
                    </el-col>
                </el-row>
                <hr style="border: 1px dashed darkgray;width: 1360px;transform: scaleY(0.5);margin-bottom: 25px">
                <div v-if="xt">
                    <el-row>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="办案机关">
                                <el-cascader
                                        style="width: 75%"
                                        size="large"
                                        :options="options"
                                        v-model="selectedOptions"
                                        @change="addressChange">
                                </el-cascader>
                                <el-input value="公安局" style="width: 25%" readonly></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="侦查案号">
                                <el-input v-model="zcForm.zcnh" placeholder="请填写侦查案号"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="刑拘时间">
                                <el-date-picker type="date" placeholder="选择日期" v-model="zcForm.xjsj" style="width: 100%"></el-date-picker>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="逮捕时间">
                                <el-date-picker type="date" placeholder="选择日期" v-model="zcForm.dbsj" style="width: 100%"></el-date-picker>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="侦查时间">
                                <el-date-picker type="date" placeholder="选择日期" v-model="zcForm.bczcb" style="width: 47.25%"></el-date-picker>
                                至
                                <el-date-picker type="date" placeholder="选择日期" v-model="zcForm.bczce" style="width: 47.25%"></el-date-picker>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="补充侦查">
                                <el-date-picker type="date" placeholder="选择日期" v-model="zcForm.ecbcb" style="width: 47.25%"></el-date-picker>
                                至
                                <el-date-picker type="date" placeholder="选择日期" v-model="zcForm.ecbce" style="width: 47.25%"></el-date-picker>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="二次侦查">
                                <el-date-picker type="date" placeholder="选择日期" v-model="zcForm.zcqxb" style="width: 47.25%"></el-date-picker>
                                至
                                <el-date-picker type="date" placeholder="选择日期" v-model="zcForm.zcqxe" style="width: 47.25%"></el-date-picker>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="提交时间">
                                <el-input v-model="zcForm.subtime" readonly></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="21" :offset=1>
                            <el-form-item label="备注" prop="">
                                <el-input type="textarea" v-model="zcForm.remark"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </div>
                <el-row>
                    <el-col :span="1" :offset=8>
                        <el-button type="info" @click="notcd('zcForm')">返回</el-button>
                    </el-col>
                    <el-col :span="1" :offset=2>
                        <el-button type="primary" @click="formSubmit('zcForm')" style="margin-left: -10px">立即创建</el-button>
                    </el-col>
                    <el-col :span="1" :offset=2>
                        <el-button @click="resetForm('zcForm')">重置</el-button>
                    </el-col>
                </el-row>
            </el-form>
        </div>
        <div v-if="active===4">
            <el-button type="primary" @click="back">返回列表</el-button>
            <table border="1" cellpadding="0" cellspacing="0" class="case_table">
                <tr>
                    <td>
                        <span>案号</span>:<br>
                        {{trialData.caseNo}}
                    </td>
                    <td>
                        <span>委托人</span>:<br>
                        {{trialData.caseWtr}}
                    </td>
                    <td>
                        <span>承办人:</span><br>
                        {{trialData.cbr}}
                    </td>
                    <td>
                        <span>联系电话:</span><br>
                        {{trialData.tel}}
                    </td>
                </tr>
                <tr>
                    <td>
                        <span>办案机关:</span><br>
                        {{trialData.bnjg}}
                    </td>
                    <td>
                        <span>侦查案号:</span><br>
                        {{trialData.zcnh}}
                    </td>
                    <td>
                        <span>逮捕时间:</span><br>
                        {{trialData.dbsj}}
                    </td>
                    <td>
                        <span>刑拘时间:</span><br>
                        {{trialData.xjsj}}
                    </td>
                </tr>
                <tr>
                    <td>
                        <span>侦查期限:</span><br>
                        {{trialData.zcqxb}}至{{trialData.zcqxe}}
                    </td>
                    <td>
                        <span>补充侦查期限:</span><br>
                        {{trialData.bczcb}}至{{trialData.bczce}}
                    </td>
                    <td>
                        <span>二次补充侦查期限:</span><br>
                        {{trialData.ecbcb}}至{{trialData.ecbce}}
                    </td>
                    <td>

                    </td>
                </tr>
                <tr>
                    <td colspan="4">
                        <span>备注:</span><br>
                        {{trialData.remark===''?'暂无备注':trialData.remark}}
                    </td>
                </tr>
            </table>
        </div>
        <div v-if="active===5">
            <span style="font-size: 25px;margin-left: 50px"><b>基本信息</b></span>
            <hr style="border: 1px dashed darkgray;width: 93%;transform: scaleY(0.5);margin-bottom: 25px">
            <el-form ref="jcForm" :model="jcForm" :rules="rules2" label-width="80px" onsubmit="return false">
                <el-row>
                    <el-col :span="10" :offset=1>
                        <el-form-item label="案件" prop="caseNo">
                            <el-input v-model="jcForm.caseNo" placeholder="请选择案件" @click.native="choiceCase" readonly></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10" :offset=1>
                        <el-form-item label="委托人" prop="caseWtr">
                            <el-input v-model="jcForm.caseWtr" placeholder="选择案件后自动补全" readonly></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="10" :offset=1>
                        <el-form-item label="承办人" prop="cbr">
                            <el-input v-model="jcForm.cbr" placeholder="请填写承办人"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10" :offset=1>
                        <el-form-item label="电话" prop="tel">
                            <el-input v-model="jcForm.tel" placeholder="请填写承办人电话"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="3"><span style="font-size: 25px;margin-left: 50px"><b>其他选填</b></span></el-col>
                    <el-col :span="1" style="padding-top: 5px">
                        <el-switch v-model="xt"></el-switch>
                    </el-col>
                </el-row>
                <hr style="border: 1px dashed darkgray;width: 1360px;transform: scaleY(0.5);margin-bottom: 25px">
                <div v-if="xt">
                    <el-row>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="检查机关">
                                <el-cascader
                                        style="width: 75%"
                                        size="large"
                                        :options="options"
                                        v-model="selectedOptions"
                                        @change="addressChange">
                                </el-cascader>
                                <el-input value="检察院" style="width: 25%" readonly></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="10" :offset=1>
                            <el-form-item label="审查起诉">
                                <el-date-picker type="date" placeholder="选择日期" v-model="jcForm.qssjb" style="width: 47.25%"></el-date-picker>
                                至
                                <el-date-picker type="date" placeholder="选择日期" v-model="jcForm.qssje" style="width: 47.25%"></el-date-picker>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="21" :offset=1>
                            <el-form-item label="备注" prop="">
                                <el-input type="textarea" v-model="jcForm.remark"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </div>
                <el-row>
                    <el-col :span="1" :offset=8>
                        <el-button type="info" @click="notcd('jcForm')">返回</el-button>
                    </el-col>
                    <el-col :span="1" :offset=2>
                        <el-button type="primary" @click="formSubmit('jcForm')" style="margin-left: -10px">立即创建</el-button>
                    </el-col>
                    <el-col :span="1" :offset=2>
                        <el-button @click="resetForm('jcForm')">重置</el-button>
                    </el-col>
                </el-row>
            </el-form>
        </div>
        <div v-if="active===6">
            <el-button type="primary" @click="back">返回列表</el-button>
            <table border="1" cellpadding="0" cellspacing="0" class="case_table">
                <tr>
                    <td>
                        <span>案号</span>:<br>
                        {{trialData.caseNo}}
                    </td>
                    <td>
                        <span>委托人</span>:<br>
                        {{trialData.caseWtr}}
                    </td>
                    <td>
                        <span>承办人:</span><br>
                        {{trialData.cbr}}
                    </td>
                    <td>
                        <span>联系电话:</span><br>
                        {{trialData.tel}}
                    </td>
                </tr>
                <tr>
                    <td>
                        <span>检查机关:</span><br>
                        {{trialData.bnjg}}
                    </td>
                    <td>
                        <span>审查起诉:</span><br>
                        {{trialData.qssjb}}至{{trialData.qssje}}
                    </td>
                    <td>

                    </td>
                    <td>

                    </td>
                </tr>
                <tr>
                    <td colspan="4">
                        <span>备注:</span><br>
                        {{trialData.remark===''?'暂无备注':trialData.remark}}
                    </td>
                </tr>
            </table>
        </div>
    </div>
</template>

<script>
    import AddCaseService from "../../model/AddCaseService";
    import $ from "jquery"
    import { provinceAndCityData, CodeToText } from 'element-china-area-data'

    const addCaseService=AddCaseService.getInstance();
    export default {
        name: "CaseTrial",
        components:{

        },
        data(){
            return{
                activeName:"first",//标签页
                active:0,//页面显示切换
                trialData:[],//表格数据
                trialId:"",//存储id
                tabIndex:"0",//存储当前标签页码
                xt:false,//选填内容
                caseData:[],//案件数据
                caseLimitData:[],//限制后的数据
                caseDatas:[],//完整数据
                getCase:false,//案件对话框

                total:"",//数据总条数
                pageSize:5,//每页显示条数
                pageNum:1,//当前页

                options: provinceAndCityData,
                selectedOptions: [],

                caseTrialSearch:{//高查数据
                    searchData:"",//搜索框数据
                    select:"",//下拉框选项
                    status:"",//开庭状态
                    sortMode:"1",//排序方法
                },

                fyForm:{//法院信息
                    caseid:"",//案件id
                    caseNo:"",//案号
                    caseWtr:"",//委托人
                    flow:"",//审判程序
                    spjg:"",//审判机关
                    lnsj:null,//立案时间
                    ktsj:null,//开庭时间
                    xprq:null,//宣判日期
                    ssrq:null,//上诉日期
                    ft:"",//法庭
                    fg:"",//法官
                    sjy:"",//书记员
                    remark:"",//备注
                    fgtel:"",//法官电话
                    sjtel:"",//书记电话
                    subtime:"",//提交时间
                    uname:"",//提交人
                    lntx:"",//立案提醒
                    kttx:"",//开庭提醒
                    xptx:"",//宣判提醒
                    sstx:"",//上诉提醒
                },
                rules:{
                    caseNo:[
                        {required:true,message:"请选择案件!"}
                    ],
                    caseWtr:[
                        {required:true,message:"请选择案件!",trigger:"blur"}
                    ],
                    flow:[
                        {required:true,message:"请选择案件!",trigger:"blur"}
                    ],
                    spjg:[
                        {required:true,message:"请选择案件!",trigger:"blur"}
                    ],
                    fgtel:[
                        {pattern:"^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$",required:false,message:"请输入有效电话！"}
                    ],
                    sjtel:[
                        {pattern:"^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$",required:false,message:"请输入有效电话！"}
                    ],
                },

                zcForm:{//侦查信息
                    caseid:"",//案件id
                    caseNo:"",//案号
                    caseWtr:"",//委托人
                    cbr:"",//承办人
                    tel:"",//电话
                    bnjg:"",//办案机关
                    zcnh:"",//侦查案号
                    xjsj:null,//刑拘时间
                    dbsj:null,//逮捕时间
                    zcqxb:null,//侦查期限始
                    zcqxe:null,//侦查期限止
                    bczcb:null,//补充侦查始
                    bczce:null,//补充侦查止
                    ecbcb:null,//二次始
                    ecbce:null,//二次止
                    remark:"",//备注
                    uname:"",//提交人
                    subtime:"",//提交时间
                },
                rules1:{
                    caseNo:[
                        {required:true,message:"请选择案件!"}
                    ],
                    caseWtr:[
                        {required:true,message:"请选择案件!",trigger:"blur"}
                    ],
                    cbr:[
                        {pattern:"^[\u4e00-\u9fa5]{2,4}$",required:true,message:"姓名为2-4字！",trigger:"blur"}
                    ],
                    tel:[
                        {pattern:"^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$",required:true,message:"请输入有效电话！"}
                    ],
                },

                jcForm:{
                    caseid:"",//案件id
                    caseNo:"",//案号
                    caseWtr:"",//委托人
                    cbr:"",//承办人
                    tel:"",//电话
                    bnjg:"",//办案机关
                    qssjb:null,//起诉时间始
                    qssje:null,//起诉时间止
                    remark:"",//备注
                    uname:"",//提交人
                    subtime:"",//提交时间
                },
                rules2:{
                    caseNo:[
                        {required:true,message:"请选择案件!"}
                    ],
                    caseWtr:[
                        {required:true,message:"请选择案件!",trigger:"blur"}
                    ],
                    cbr:[
                        {pattern:"^[\u4e00-\u9fa5]{2,4}$",required:true,message:"姓名为2-4字！",trigger:"blur"}
                    ],
                    tel:[
                        {pattern:"^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$",required:true,message:"请输入有效电话！"}
                    ],
                },
            }
        },
        created() {
            this.queryFy(null);
            setInterval(()=>{
                this.zcForm.subtime=this.$date.formatDate(new Date(),"yyyy-MM-DD hh:mm:ss")
            },1000)
        },
        methods:{
            addressChange(){//地区选择
                if(this.active===3){
                    this.zcForm.bnjg=CodeToText[this.selectedOptions[0]]+CodeToText[this.selectedOptions[1]]+"公安局";
                }else{
                    this.jcForm.bnjg=CodeToText[this.selectedOptions[0]]+CodeToText[this.selectedOptions[1]]+"检察院";
                }
            },
            back(){//返回
                if(this.tabIndex==="0"){
                    this.queryFy(null);
                }else if(this.tabIndex==="1"){
                    this.queryZc(null)
                }else {
                    this.queryJc(null)
                }
                this.active=0
            },
            addJc(){//添加检查信息
                this.active=5
            },
            addZc(){//添加侦查信息
              this.active=3
            },
            addFy(){//添加法院信息
              this.active=1
            },
            notcd(formName){
                this.$refs[formName].resetFields();
                this.active=0;
                if(this.tabIndex==="0"){
                    this.queryFy(null);
                }else if(this.tabIndex==="1"){
                    this.queryZc(null)
                }
            },
            salaryChange(e){//过滤非数字
                if(e.target.id==="lntx"){
                    this.fyForm.lntx=e.target.value
                }else if(e.target.id==="kttx"){
                    this.fyForm.kttx=e.target.value
                }else if(e.target.id==="xptx"){
                    this.fyForm.xptx=e.target.value
                }else{
                    this.fyForm.sstx=e.target.value
                }
            },
            rowClick(row){//案件表格点击事件//, column, event
                this.getCase=false;
                if(this.active===1){
                    this.$loading({//懒加载
                        lock: true,
                        text: '正在查询...',
                        spinner: 'fa fa-refresh fa-spin fa-3x',
                        background: 'rgba(0, 0, 0, 0.7)'
                    });
                    this.fyForm.caseid=row.id;
                    this.fyForm.caseWtr=row.caseWtr;
                    this.fyForm.caseNo=row.caseNo;
                    this.fyForm.spjg=row.courtName;
                    addCaseService.queryCaseType(this.$http,row.caseCaseTypeId).then(msg=>{
                        this.fyForm.flow=msg.data.data.substring(0,2)+"程序";
                        this.$loading().close();
                    });
                }else if(this.active===3){
                    this.zcForm.caseid=row.id;
                    this.zcForm.caseWtr=row.caseWtr;
                    this.zcForm.caseNo=row.caseNo;
                }else{
                    this.jcForm.caseid=row.id;
                    this.jcForm.caseWtr=row.caseWtr;
                    this.jcForm.caseNo=row.caseNo;
                }
            },
            choiceCase(){//选择案件
                if(this.caseData.length===0){
                    this.$loading({//懒加载
                        lock: true,
                        text: '正在查询...',
                        spinner: 'fa fa-refresh fa-spin fa-3x',
                        background: 'rgba(0, 0, 0, 0.7)'
                    });
                    const params={
                        hrEmpId:JSON.parse(localStorage["user"])[0].hrEmpId,
                        pageSize:2147483647,
                    };
                    addCaseService.querySenior(this.$http,params).then(msg=>{
                        $.each(msg.data.data.list,(i,n)=> {
                            if(n.caseCaseTypeId.substring(0,4)==="1001"||n.caseCaseTypeId.substring(0,4)==="1002"
                                ||n.caseCaseTypeId.substring(0,4)==="1003"||n.caseCaseTypeId.substring(0,4)==="1004"
                                ||n.caseCaseTypeId.substring(0,4)==="1005"){
                                this.caseLimitData.push(n)
                            }
                            if(n.caseCaseTypeId.substring(0,4)==="1002"){
                                this.caseDatas.push(n)
                            }
                        });
                        if(this.active===5){
                            this.caseData=this.caseDatas;
                        }else{
                            this.caseData=this.caseLimitData
                        }
                        this.$loading().close();
                    });
                }else{
                    if(this.active===5){
                        this.caseData=this.caseDatas;
                    }else{
                        this.caseData=this.caseLimitData
                    }
                }
                this.getCase=true;
            },
            formSubmit(formName){//提交表单
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        if(formName==="fyForm"){
                            if(this.fyForm.lntx===""){
                                this.fyForm.lntx=0
                            }
                            if(this.fyForm.kttx===""){
                                this.fyForm.kttx=0
                            }
                            if(this.fyForm.xptx===""){
                                this.fyForm.xptx=0
                            }
                            if(this.fyForm.sstx===""){
                                this.fyForm.sstx=0
                            }
                            if(this.fyForm.lnsj!=null){
                                this.fyForm.lnsj=this.$date.formatDate(this.fyForm.lnsj,"yyyy-MM-DD")
                            }
                            if(this.fyForm.ktsj!=null){
                                this.fyForm.ktsj=this.$date.formatDate(this.fyForm.ktsj,"yyyy-MM-DD")
                            }
                            if(this.fyForm.xprq!=null){
                                this.fyForm.xprq=this.$date.formatDate(this.fyForm.xprq,"yyyy-MM-DD")
                            }
                            if(this.fyForm.ssrq!=null){
                                this.fyForm.ssrq=this.$date.formatDate(this.fyForm.ssrq,"yyyy-MM-DD")
                            }
                            this.fyForm.uname=JSON.parse(localStorage["user"])[0].userRealname;
                            this.fyForm.subtime=this.$date.formatDate(new Date(),"yyyy-MM-DD hh:mm:ss");
                            let formData = new FormData();
                            for(const key in this.fyForm){
                                if(Object.prototype.hasOwnProperty.call(this.fyForm, key)){
                                    if(this.fyForm[key]!=null){
                                        formData.append(key,this.fyForm[key]);
                                    }
                                }
                            }
                            addCaseService.addFy(this.$http,formData).then(msg=>{
                                if(msg.data.status==="50000"){
                                    this.$message({
                                        type:"error",
                                        message:"出错了呢~"
                                    })
                                }else {
                                    this.$message({
                                        type:"success",
                                        message:"添加成功~"
                                    });
                                    this.$refs.fyForm.resetFields();
                                    this.active=0;
                                    this.queryFy(null);
                                }
                            })
                        }else if(formName==="zcForm"){
                            if(this.zcForm.dbsj!=null){
                                this.zcForm.dbsj=this.$date.formatDate(this.zcForm.dbsj,"yyyy-MM-DD")
                            }
                            if(this.zcForm.xjsj!=null){
                                this.zcForm.xjsj=this.$date.formatDate(this.zcForm.xjsj,"yyyy-MM-DD")
                            }
                            if(this.zcForm.zcqxb!=null){
                                this.zcForm.zcqxb=this.$date.formatDate(this.zcForm.zcqxb,"yyyy-MM-DD")
                            }
                            if(this.zcForm.zcqxe!=null){
                                this.zcForm.zcqxe=this.$date.formatDate(this.zcForm.zcqxe,"yyyy-MM-DD")
                            }
                            if(this.zcForm.bczcb!=null){
                                this.zcForm.bczcb=this.$date.formatDate(this.zcForm.bczcb,"yyyy-MM-DD")
                            }
                            if(this.zcForm.bczce!=null){
                                this.zcForm.bczce=this.$date.formatDate(this.zcForm.bczce,"yyyy-MM-DD")
                            }
                            if(this.zcForm.ecbcb!=null){
                                this.zcForm.ecbcb=this.$date.formatDate(this.zcForm.ecbcb,"yyyy-MM-DD")
                            }
                            if(this.zcForm.ecbce!=null){
                                this.zcForm.ecbce=this.$date.formatDate(this.zcForm.ecbce,"yyyy-MM-DD")
                            }
                            this.zcForm.uname=JSON.parse(localStorage["user"])[0].userRealname;
                            let formData = new FormData();
                            for(const key in this.zcForm){
                                if(Object.prototype.hasOwnProperty.call(this.zcForm, key)){
                                    if(this.zcForm[key]!=null){
                                        formData.append(key,this.zcForm[key]);
                                    }
                                }
                            }
                            addCaseService.addZc(this.$http,formData).then(msg=>{
                                if(msg.data.status==="50000"){
                                    this.$message({
                                        type:"error",
                                        message:"出错了呢~"
                                    })
                                }else {
                                    this.$message({
                                        type:"success",
                                        message:"添加成功~"
                                    });
                                    this.$refs[formName].resetFields();
                                    this.active=0;
                                    this.queryZc(null);
                                }
                            })
                        }else{
                            this.jcForm.uname=JSON.parse(localStorage["user"])[0].userRealname;
                            this.jcForm.subtime=this.$date.formatDate(new Date(),"yyyy-MM-DD hh:mm:ss");
                            if(this.jcForm.qssjb!=null){
                                this.jcForm.qssjb=this.$date.formatDate(this.jcForm.qssjb,"yyyy-MM-DD")
                            }
                            if(this.jcForm.qssje!=null){
                                this.jcForm.qssje=this.$date.formatDate(this.jcForm.qssje,"yyyy-MM-DD")
                            }
                            let formData = new FormData();
                            for(const key in this.jcForm){
                                if(Object.prototype.hasOwnProperty.call(this.jcForm, key)){
                                    if(this.jcForm[key]!=null){
                                        formData.append(key,this.jcForm[key]);
                                    }
                                }
                            }
                            addCaseService.addJc(this.$http,formData).then(msg=>{
                                if(msg.data.status==="50000"){
                                    this.$message({
                                        type:"error",
                                        message:"出错了呢~"
                                    })
                                }else {
                                    this.$message({
                                        type:"success",
                                        message:"添加成功~"
                                    });
                                    this.$refs[formName].resetFields();
                                    this.active=0;
                                    this.queryJc(null);
                                }
                            })
                        }
                    }
                })
            },
            resetForm(formName) {//重置表单
                this.$refs[formName].resetFields();
            },
            seniorSearch(){//高级检索
                this.pageSize=5;
                if(this.tabIndex==="0"){
                    this.queryFy(null)
                }else if(this.tabIndex==="1"){
                    this.queryZc(null)
                }else{
                    this.queryJc(null)
                }
            },
            handleCurrentChange(val){//当前页发生变化
                if(this.tabIndex==="0"){
                    const page={
                        pageNum:val
                    };
                    this.queryFy(page);
                }else if(this.tabIndex==="1"){
                    const page={
                        pageNum:val
                    };
                    this.queryZc(page)
                }else{
                    const page={
                        pageNum:val
                    };
                    this.queryJc(page)
                }
            },
            handleSizeChange(val){//每页数据条数变化
                if(this.tabIndex==="0"){
                    const page={
                        pageSize:val
                    };
                    this.queryFy(page);
                }else if(this.tabIndex==="1"){
                    const page={
                        pageSize:val
                    };
                    this.queryZc(page)
                }else{
                    const page={
                        pageSize:val
                    };
                    this.queryJc(page)
                }
            },
            handlClick(tab){//标签页切换
                this.tabIndex=tab.index;
                this.active=0;
                this.pageSize=5;
                if(tab.index==="0"){
                    this.queryFy(null)
                }else if(tab.index==="1"){
                    this.queryZc(null)
                }else{
                    this.queryJc(null)
                }
            },
            queryDetails(id){//查看案件详情
                this.$loading({//懒加载
                    lock: true,
                    text: '正在查询...',
                    spinner: 'fa fa-refresh fa-spin fa-3x',
                    background: 'rgba(0, 0, 0, 0.7)'
                });
                const param={
                    id:id
                };
                if(this.tabIndex==="0"){
                    addCaseService.queryFy(this.$http,param).then(msg=>{
                        this.trialData=msg.data.data.list[0];
                        this.$loading().close();
                    });
                    this.active=2
                }else if(this.tabIndex==="1"){
                    addCaseService.queryZc(this.$http,param).then(msg=>{
                        this.trialData=msg.data.data.list[0];
                        this.$loading().close();
                    });
                    this.active=4
                }else{
                    addCaseService.queryJc(this.$http,param).then(msg=>{
                        this.trialData=msg.data.data.list[0];
                        this.$loading().close();
                    });
                    this.active=6
                }
            },
            queryFy(params){//查询法院信息
                this.$loading({//懒加载
                    lock: true,
                    text: '正在查询...',
                    spinner: 'fa fa-refresh fa-spin fa-3x',
                    background: 'rgba(0, 0, 0, 0.7)'
                });
                const param={
                    searchData:this.caseTrialSearch.searchData,//搜索框数据
                    select:this.caseTrialSearch.select,//下拉框选项
                    status:this.caseTrialSearch.status,//审批状态
                    sortMode:this.caseTrialSearch.sortMode,//排序方法
                    uname:JSON.parse(localStorage["user"])[0].hrEmpId,
                    pageNum:params==null?this.pageNum:(params.pageNum===undefined?this.pageNum:params.pageNum),
                    pageSize:params==null?this.pageSize:(params.pageSize===undefined?this.pageSize:params.pageSize)
                };
                addCaseService.queryFy(this.$http,param).then(msg=>{
                    this.trialData=msg.data.data.list;
                    this.total=msg.data.data.total;
                    this.pageSize=msg.data.data.pageSize;
                    this.$loading().close();
                })
            },
            queryZc(params){//查询侦查信息
                this.$loading({//懒加载
                    lock: true,
                    text: '正在查询...',
                    spinner: 'fa fa-refresh fa-spin fa-3x',
                    background: 'rgba(0, 0, 0, 0.7)'
                });
                const param={
                    searchData:this.caseTrialSearch.searchData,//搜索框数据
                    select:this.caseTrialSearch.select,//下拉框选项
                    uname:JSON.parse(localStorage["user"])[0].hrEmpId,
                    pageNum:params==null?this.pageNum:(params.pageNum===undefined?this.pageNum:params.pageNum),
                    pageSize:params==null?this.pageSize:(params.pageSize===undefined?this.pageSize:params.pageSize)
                };
                addCaseService.queryZc(this.$http,param).then(msg=>{
                    this.trialData=msg.data.data.list;
                    this.total=msg.data.data.total;
                    this.pageSize=msg.data.data.pageSize;
                    this.$loading().close();
                })
            },
            queryJc(params){//查询检查信息
                this.$loading({//懒加载
                    lock: true,
                    text: '正在查询...',
                    spinner: 'fa fa-refresh fa-spin fa-3x',
                    background: 'rgba(0, 0, 0, 0.7)'
                });
                const param={
                    searchData:this.caseTrialSearch.searchData,//搜索框数据
                    select:this.caseTrialSearch.select,//下拉框选项
                    uname:JSON.parse(localStorage["user"])[0].hrEmpId,
                    pageNum:params==null?this.pageNum:(params.pageNum===undefined?this.pageNum:params.pageNum),
                    pageSize:params==null?this.pageSize:(params.pageSize===undefined?this.pageSize:params.pageSize)
                };
                addCaseService.queryJc(this.$http,param).then(msg=>{
                    this.trialData=msg.data.data.list;
                    this.total=msg.data.data.total;
                    this.pageSize=msg.data.data.pageSize;
                    this.$loading().close();
                })
            },
        }
    }
</script>

<style scoped>
    .case_table{
        margin-top: 10px;
        border-collapse: collapse;
        width: 99%;
    }
    .case_table,.case_table td{
        border: 1px solid gainsboro;
    }
    .case_table td{
        padding: 20px 20px 20px 10px;
    }
    .case_table span{
        color: #777777;
    }
</style>